<template>
	<view class="loginWrap">
		<view class="_top_text">
			<text>输入验证码</text><br/>
		</view>
		<view class="_top_text_number">
			<text class="_top_text_number_top">	输入验证码发送至</text>
			<text class="_top_text_number_bottom">{{phone}}</text>
		</view>
		<view class="content">
			 <verification-code-style borderStyle="border-bottom:1px solid gray" borderCheckStyle="border:1px solid rgb(117, 202, 104);"
					 :latticeNum="6" @getInputVerification="getInputVerification"></verification-code-style>
		</view>
		<view @click="getCheckNum" class="_code_view"   v-if="!codeTime">{{'重新获取'}}</view>
		 <view  class="_code_view" style="color:#AEADB2;" v-if="codeTime">{{'重新获取（'+codeTime+'s）'}}</view>
		
		
	</view>
</template>

<script>
	var _self;
	import verificationCodeStyle from '@/components/verification-code-style2/verification-code-style2'

	export default {
		components: {
			verificationCodeStyle
		},
		data() {
			return {
				input_len: 6, // 验证码长度
				input_val: '', // 验证码的值
				isFocus: true,
				codeTime:60,
				phone:'',
				lx:'',
				forgetPwd:0
			}
		},
		onLoad(options) {
			_self=this
			_self.phone=options.phone
			_self.lx=options.lx
			_self.forgetPwd=options.forgetPwd
			let timer = setInterval(()=>{
				  this.codeTime--;
				  if(this.codeTime<1){
				  clearInterval(timer);
				  this.codeTime = 0
				}
			},1000)
			
		},
		onShow() {
			
		},
		methods: {
			 // 用户输入的值
			// getInputVerification(e) {
			// 	console.log(e);
			// },
			
			getInputVerification(e) {
				this.input_val = e;
				if (this.input_val.length == 6) {
					
					//使用全局变量中的url
					var uri = getApp().globalData.url + 'modules/serviceUser/loginUserByCode';
					
					uni.request({
						url: uri,
						data:{
							phone:_self.phone,
							code:_self.input_val,
						} ,
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded'
						},
						success(res) {
							var resData = res.data;
							
							if (resData.code == "200") {
								
								
								
									// if(_self.forgetPwd == 1){
									// 	uni.navigateTo({
									// 	 	url: '../login/forgetpwd?id='+resData.data.id
									// 	});
									// }else{
										/*
										 本地数据缓存，缓存用户登录信息
										 */
										uni.setStorage({
											key: 'user',
											data: resData.data,
											success: function() {
											}
										});
										uni.navigateTo({
											url: '../index/index',
										});	
									// }
									
								
								
							} else {
								//消息提示框
								uni.showToast({
									title: resData.msg,
									duration: 2000,
									icon: "none"
								});
								return false;
							}
						},
						fail: (res) => {
							uni.showToast({
								title:res.errMsg,
								duration: 2000,
								icon: "none"
							});
						}
					})
					
				}
			},
			
			//点击获取验证码倒计时
			  getCheckNum(){
					
					 if(this.codeTime>0){
						  uni.showToast({
							  title: '不能重复获取',
							  icon:"none"
						  });
						  return;
					 }else{
						  this.codeTime = 60
						  let timer = setInterval(()=>{
							  this.codeTime--;
							  if(this.codeTime<1){
							  clearInterval(timer);
							  this.codeTime = 0
							}
						  },1000)
					}
					var uri = getApp().globalData.url + 'modules/serviceUser/getCode';
					var formData = {
						phone:this.phone
					};
					uni.request({
						url: uri,
						data:formData,
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded'
						},
						success(res) {
							var resData = res.data;
							if (resData.code == "200") {
								//console.log(resData)
							} 
						},
						fail: (res) => {
							
						}
					})
			   }
		}
	}
</script>

<style lang="less">
	.loginWrap{
		width:100%;
		float:left;
	}
	.content {
	      width:500rpx;
	      margin: 50rpx auto;
	}
	._top_text{
		font-size: 28px;
		font-weight: bold;
		margin-top: 180rpx;
		margin-left:60rpx;
		margin-bottom: 20rpx;
	
	}
	._top_text_number{
		margin-left:60rpx;
	}
	._top_text_number_bottom{
		color:#2C3CA1;
	}
	._top_text_number_top{
		color:#75767A;
	}

	.wrap {
        padding: 0 60rpx;
		margin-top:160rpx;
    }

   
	._code_view{
		margin-top: 50rpx;
		color:blue;
		margin-left:60rpx;
	}

</style>
